@import "./variables";
.text-ellipsis--one {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-ellipsis--muti(@lines:2) {
  display: -webkit-box;
  /*! autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: @lines;
  overflow: hidden;
  text-overflow: ellipsis;
}

.click-active--opacity {
  &:active {
    background: #f2f3f5;
  }
}

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-vertical-center(@height) {
  display: flex;
  align-items: center;
  height: @height;
}

/*移动端ios 回弹*/
.ios-bounce-android {
  over-flow: auto; /* winphone8和android4+ */
  -webkit-overflow-scrolling: touch; /* ios5+ */
}

/*滚动条样式*/
.div--webkit--scrollbar(@bg: #d2cece) {
  @media screen and(min-width:720px) {
    /* 设置滚动条的样式 */
    &::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }

    /* 滚动槽 */
    &::-webkit-scrollbar-track {
      //-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
      //border-radius: 8px;
    }
    // 滚动条滑块
    &::-webkit-scrollbar-thumb {
      background-color: @bg;
      background-clip: padding-box;
      border: 3px solid transparent;
      border-radius: 7px;
    }

    &::-webkit-scrollbar-thumb:hover {
      background-color: @primary-color;
      background-clip: padding-box;
      border: 3px solid transparent;
      border-radius: 7px;
      cursor: grab;
    }

    &::-webkit-scrollbar-thumb:window-inactive {
      background-color: @primary-color;
      background-clip: padding-box;
      border: 3px solid transparent;
      border-radius: 7px;
    }
  }
}

/*骨架屏样式*/
section.skeleton {
  height: 100%;
  //overflow: hidden;
  max-width: @max-width;
  min-width: @min-width;
  position: relative;
  margin: auto;
  p {
    position: absolute;
    margin: 0;
    padding: 0;
  }
}

.flex {
  display: flex;
}

.items-center {
  align-items: center;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}

.flex-col {
  flex-direction: column;
}

.flex-row	{
  flex-direction: row;
}

